<template>
    <div>
        <h1>新增机构</h1>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">机构名称</td>
                    <td>
                        <input type="text" v-model="info.Name">
                    </td>
                </tr>
                <tr>
                    <td align="right">机构封面</td>
                    <td>
                        <input type="file" @change="img">
                        <img :src="info.Photo" alt="" width="100" height="100" v-if="info.Photo!=''">
                    </td>
                </tr>
                <tr>
                    <td align="right">特色服务</td>
                    <td>
                        <select v-model="info.Tese">
                            <option value="">请选择</option>
                            <option v-for="item in list1" :key="item.Id" :value="item.Tese">{{ item.Tese }}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td align="right">营业时间</td>
                    <td>
                        <input type="date" v-model="info.DateTime">
                    </td>
                </tr>
                <tr>
                    <td align="right">机构地址</td>
                    <td>
                        <input type="text" v-model="info.Addr">
                    </td>
                </tr>
                <tr>
                    <td align="right">联系电话</td>
                    <td>
                        <input type="text" v-model="info.Phone">
                    </td>
                </tr>
                <tr>
                    <td align="right">发布时间</td>
                    <td>
                        <input type="radio" v-model="info.Pub" name="pub" :value="0">立即发布
                        <input type="radio" v-model="info.Pub" name="pub" :value="1">定时发布
                    </td>
                </tr>
                <tr>
                    <td align="right">机构状态</td>
                    <td>
                        <input type="radio" v-model="info.State" name="state" :value="0">未发布
                        <input type="radio" v-model="info.State" name="state" :value="1">已发布
                    </td>
                </tr>
                <tr>
                    <td align="right">机构详情</td>
                    <td>
                        <textarea cols="50" rows="5" v-model="info.Desc"></textarea>
                    </td>
                </tr>
                <tr>
                    <td align="right">操作</td>
                    <td>
                        <input type="button" class="btn btn-primary" value="添加" @click="ok">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import {ref,reactive,onMounted} from 'vue'
import axios from 'axios';
import { useRoute,useRouter } from 'vue-router';
const route=useRoute();
const router=useRouter();

let info:any=reactive({
    "Name": "",
  "Photo": "",
  "Tese": "",
  "DateTime": "",
  "Addr": "",
  "Phone": "",
  "Pub": 0,
  "State":0,
  "Desc": "",
})


onMounted(()=>{
    getlist1();
})

let list1:any=ref([])
const getlist1=()=>{
    axios({
        url:'http://localhost:5130/api/Exams/GetTeseList',
        method:'get',
        params:list1
    })
    .then(res=>{
        list1.value=res.data;
    })
    .catch(err=>{
        console.log(err);
        
    })
}

const img=(e:any)=>{
    let obj=e.target.files[0];
    let f=new FormData();
    f.append('file',obj);
    axios({
        url:'http://localhost:5130/api/Imgs/Img',
        method:'post',
        data:f
    })
    .then(res=>{
        if(res.data=='图片格式不正确')
    {
        alert('图片格式不正确');
        return;
    }
        info.Photo=res.data;
    })
    .catch(err=>{
        console.log(err);
        
    })
}

const ok=()=>{
    if(info.Name=="")
{
    alert('机构名称不能为空');
    return;
}
if(info.Photo=="")
{
    alert("机构封面不能为空");
    return;
}
if(info.Tese=="")
{
    alert("特色服务不能为空");
    return;
}

if(info.DateTime=="")
{
    alert("营业时间不能为空");
    return;
}
if(info.Addr=="")
{
    alert("机构地址不能为空");
    return;
}
if(info.Phone=="")
{
    alert("联系电话不能为空");
    return;
}
if(info.Desc=="")
{
    alert("机构详情不能为空");
    return;
}
axios({
    url:'http://localhost:5130/api/Exams/AddIns',
    method:'post',
    data:info
})
.then(res=>{
    if(res.data>0)
{
    alert('添加成功');
    router.push('/Show');
}
else{
    alert('添加失败');
    return;
}
})
.catch(err=>{
        console.log(err);
        
    })
}

</script>

<style scoped>

</style>